@menu-width: 130px;
@media screen and (min-width: 1501px) {
    #menu-container {
        width: @menu-width;
    }
    #content-container {
        left: @menu-width;
    }
    .menu-item {
        padding-left: 10px;
        padding-top: 1rem;
        padding-bottom: 1rem;
        min-height: 74px;
        i {
            display: flex;
        }
        span {
            display: flex;
        }
        &.active {
            background-color: #2D9B5C;
            // background-image: linear-gradient(left, lighten(#2D9B5C, 5%), darken(#2D9B5C, 3%));
            // background-image: -webkit-linear-gradient(left, lighten(#2D9B5C, 5%), darken(#2D9B5C, 3%));
            // &::before {
            //     content: "";
            //     position: absolute;
            //     background-color: #2D9B5C;
            //     background-image: linear-gradient(left, darken(#2D9B5C, 3%), darken(#2D9B5C, 6%));
            //     background-image: -webkit-linear-gradient(left, darken(#2D9B5C, 3%), darken(#2D9B5C, 6%));
            //     width: 8px;
            //     left: 100%;
            //     top: 0;
            //     bottom: 0;
            //     z-index: 10;
            // }
            // &::after {
            //     z-index: 10;
            //     content: "";
            //     position: absolute;
            //     left: 100%;
            //     top: 100%;
            //     width: 0;
            //     height: 0;
            //     border-top: 12px solid darken(#2D9B5C, 20%);
            //     border-right: 12px solid transparent;
            // }
        }
    }
    @prjListWidth: 480px;
    #projectPanel {
        width: @prjListWidth;
        .line-panel {
            margin-left: 4rem;
        }
    }
    #projectDetail {
        left: @prjListWidth;
    }
}
